<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Ofdm</title>
    <link rel="stylesheet" type="text/css" href="../00-00-00-common/ui/spectrogram.css">
</head>
<body onload="init()">

<!-- audio network BEGIN - this kind of booting only for 'AudioNetwork' development -->
<!-- <script>
    var AudioNetworkBootConfig = {
        devScriptLoad: true
    };
</script>
<script src="../../src/audio-network-boot.js"></script> -->
<!-- audio network END -->

<script src="https://cdn.rypula.pl/audio-network/v1.3.2/audio-network-v1.3.2.min.js"></script>

<script src="../00-00-00-common/ui/dom-util.js"></script>
<script src="../00-00-00-common/ui/spectrogram.js"></script>
<script src="ofdm.js"></script>

<h1>General config</h1>

<div>
    <input id="loopback" type="checkbox" onChange="loopbackChange()" />
</div>
<div>
    <button onClick="audioMonoIO.microphoneDisable()">Mic OFF</button>
    <button onClick="audioMonoIO.microphoneEnable()">Mic ON</button>
</div>

<h1>Generate</h1>
TxSampleRate: <input id="tx-sample-rate" type="number" min="44000" max="48100" step="100" value="48000" onChange="txStartUpdate()"><br/>
#05 <input id="sub-carrier-0" type="number" min="-1" max="359" step="1" value="0" onChange="txStartUpdate()"><br/>
#06 <input id="sub-carrier-1" type="number" min="-1" max="359" step="1" value="0" onChange="txStartUpdate()"><br/>
#07 <input id="sub-carrier-2" type="number" min="-1" max="359" step="1" value="0" onChange="txStartUpdate()"><br/>
#08 <input id="sub-carrier-3" type="number" min="-1" max="359" step="1" value="0" onChange="txStartUpdate()"><br/>
#09 <input id="sub-carrier-4" type="number" min="-1" max="359" step="1" value="0" onChange="txStartUpdate()"><br/>
#10 <input id="sub-carrier-5" type="number" min="-1" max="359" step="1" value="0" onChange="txStartUpdate()"><br/>
#11 <input id="sub-carrier-6" type="number" min="-1" max="359" step="1" value="0" onChange="txStartUpdate()"><br/>
#12 <input id="sub-carrier-7" type="number" min="-1" max="359" step="1" value="-1" onChange="txStartUpdate()"><br/>
#13 <input id="sub-carrier-8" type="number" min="-1" max="359" step="1" value="-1" onChange="txStartUpdate()"><br/>
#14 <input id="sub-carrier-9" type="number" min="-1" max="359" step="1" value="-1" onChange="txStartUpdate()"><br/>

<div>
    Auto generate <input id="auto-generate" type="checkbox" />
</div>

<button onclick="txStop()">Stop</button>

<h1>Detect</h1>

<div>
    <span id="time-log"></span>
</div>
<div>
    OFDM symbols <input type="number" id="factor" value="1" min="1" max="16" step="1">
</div>
<div>
    sample offset <input type="number" id="time-domain-starting-offset" value="1" min="0" max="8192" step="1">
</div>

<h2>Time domain</h2>

<div>
    Log scale <input type="checkbox" id="log-scale" />
</div>

<canvas style="border: 1px solid lightgray" id="canvas-time-domain"></canvas>

<h2>Frequency domain</h2>

<div>
    fix phase <input type="checkbox" id="fix-phase" checked />
</div>
<canvas style="border: 1px solid lightgray" id="canvas-frequency-domain"></canvas>

<div id="spectrogram" style="width: 300px;"></div>

<div style="font-family: monospace;" id="subcarrier-log"></div>

</body>
</html>